<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<link rel="stylesheet" type="text/css" href="../../bootstrap-3.3.7/dist/css/bootstrap.min.css" />
<link rel="stylesheet" type="text/css" href="../../bootstrap-3.3.7/dist/css/bootstrap-theme.min.css" />
<link rel="stylesheet" type="text/css" href="../../css/index.css" />
<link rel="stylesheet" type="text/css" href="../../css/background.css" />
<link rel="stylesheet" type="text/css" href="../../css/question.css" />
<script type="text/javascript" src="../../bootstrap-3.3.7/dist/js/jquery.min.js"></script>
<script type="text/javascript" src="../../bootstrap-3.3.7/dist/js/bootstrap.js"></script>
<script type="text/javascript" src="../../js/bootstrap-paginator.js"></script>
<!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
<link href="../../bootstrap-3.3.7/docs/assets/css/ie10-viewport-bug-workaround.css" rel="stylesheet">
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
</head>
<body>
	<div class="container">
		<div class="row clearfix">
			<div class="col-md-12" style="padding-bottom: 10px">
				<%@include file="../common/header.jsp"%>
			</div>
		</div>
		<h4 class="heading">常见问题</h4>
		<div class="myline"></div>
		<div class="col-md-12" id="info" style="min-height: 500px;">
			
		</div>
		<div class="row">
			<div class="col-md-3"></div>
			<ul id="paginator" style="padding-left: 40px"></ul>
		</div>
		<div class="row clearfix">
			<div class="col-md-12" style="padding-bottom: 10px">
				<%@include file="../common/bottom.jsp"%>
			</div>
		</div>
	</div>
</body>
<script type="text/javascript">
//当前页面显示多少条提问
var rows = 6;
//当前总页数
var totalpage;
//计算出totalpage
$(function() {
	initQuestion(1);
	calculatetotalpage();	
});

	//计算出totalpage
	function calculatetotalpage() {
		$.ajax({
			url : '../systemMessage/getHandBookCount',
			type : 'post',
			async : false,
			success : function(result) {
				if (result % rows == 0) {
					totalpage = parseInt(result / rows);
				}
				if (result % rows != 0) {
					totalpage = parseInt(result / rows) + 1;
				}
				if (totalpage == 0) {
					$("#info").append('<div style="height:350px;"><p align="center" style="margin-top: 20px;">抱歉，没有任何问题可供您参考</p></div>');
					$("#paginator").html("");
				} else {
					paginator(totalpage);
				}
			}
		});
	}

	function paginator(value) {
		var element = $('#paginator');
		var options = {
			bootstrapMajorVersion : 3, //对应的bootstrap版本
			currentPage : 1, //当前页数，这里是用的EL表达式，获取从后台传过来的值
			numberOfPages : 6, //每页页数
			totalPages : value, //总页数，这里是用的EL表达式，获取从后台传过来的值
			shouldShowPage : true,//是否显示该按钮
			itemTexts : function(type, page, current) {//设置显示的样式，默认是箭头
				switch (type) {
					case "first" :
						return "首页";
					case "prev" :
						return "上一页";
					case "next" :
						return "下一页";
					case "last" :
						return "末页";
					case "page" :
						return page;
				}
			},
			onPageClicked : function(event, originalEvent, type, page) {
				$.ajax({
 					url : '../systemMessage/getHandBookList',
 				    type : 'get',
					async : false,
					data : {
						page : (page - 1) * rows,
						rows : rows
					},
					success : function(result) {
						var result = eval(result);
						$("#info").html("");
						//循环
						var li = "";
						for (var i = 0; i < result.length; i++) {
							li += '<div class="info_list col-md-12">';
							li += '<div class="title">问题:'
									+ result[i].content + '</div>';
							li += '<p>' + result[i].reply + '</p>';
							li += '</div>';
						}
						//循环
						$("#info").append(li); 
					}
				});
			}
		};
		element.bootstrapPaginator(options);
	}
	function initQuestion(page) {
		$.ajax({
			url : '../systemMessage/getHandBookList',
			type : 'post',
			async : false,
			data : {
				page : (page - 1) * rows,
				rows : rows
			},
			success : function(result) {
				var result = eval(result);
				$("#info").html("");
				//循环
				var li = "";
				for (var i = 0; i < result.length; i++) {
					/* li += '<div class="col-md-12">'; */
					li += '<div class="info_list">';
					li += '<div class="title">问题:' + result[i].content
							+ '</div>';
					li += '<p>' + result[i].reply + '</p>';
					li += '</div>';
					/* li += '</div>'; */
				}
				//循环
				$("#info").append(li);
			}
		});
	}
</script>
</html>